<template>
  <div id="reportList">

    <div class="flex_head">
      <div class="solid"></div>
      <div class="item_two">
        <router-link to="/report/addReport">
          <el-button type="primary">添加报件</el-button>
        </router-link>

      </div>
      <el-button type="primary" @click="goBack()">返回上一层</el-button>
    </div>
    <div class="main">
      <el-table :data="tableData" border style="width: 1100px" v-loading="loading">

        <el-table-column prop="name" label="联系人姓名" width='120'>
        </el-table-column>
        <el-table-column prop="phone" label="联系人手机号" width='120'>
        </el-table-column>
        <el-table-column prop="mchtName" label="商户名称" width='120'>
        </el-table-column>
        <el-table-column prop="subMchId" label="商户号" width='120'>
        </el-table-column>
        <el-table-column prop="userId" label="后台商户号" width='120'>
        </el-table-column>
        <el-table-column prop="mchtPhone" label="客服电话" width='120'>
        </el-table-column>
        <el-table-column prop="manageType" label="经营类型" width='120'>
        </el-table-column>

        <el-table-column prop="manageId" label="经营类目" width='120'>
        </el-table-column>
        <el-table-column prop="merMark" label="商户备注" width='120'>
        </el-table-column>
        <el-table-column prop="merAddr" label="商户地址" width='120'>
        </el-table-column>
        <el-table-column prop="corporationName" label="法人姓名" width='120'>
        </el-table-column>
        <el-table-column prop="corporationCertno" label="法人身份证号" width='120'>
        </el-table-column>
        <el-table-column prop="acctType" label="开户账户类型" width='120'>
        </el-table-column>

        <el-table-column prop="acctName" label="持卡人姓名" width='120'>
        </el-table-column>
        <el-table-column prop="idNumber" label="账户身份证号" width='120'>
        </el-table-column>
        <el-table-column prop="acctBankName" label="开户银行名称" width='120'>
        </el-table-column>
        <el-table-column prop="settacctBankno" label="行别号(银行卡信息)" width='120'>
        </el-table-column>
        <el-table-column prop="acctNo" label="银行账号(银行卡信息)" width='120'>
        </el-table-column>
      </el-table>
      <div class="block" style="text-align: right;padding-right: 40px;">

        <el-pagination :current-page.sync="pageNumber" @current-change='handleChange' :page="pageNumber"
                       :page-size="pageSize" layout="total, prev, pager, next" :total="total">
        </el-pagination>
      </div>
    </div>
  </div>
</template>

<script>
  export default {
    data () {
      return {
        tableData: [],
        pageSize: 10,
        pageNumber: 1,
        total: 1,
        loading: '',
        classify: ''
      }
    },
    created () {
      this.getReportList()
      this.classify = JSON.parse(sessionStorage.getItem('classify info')).name
    },
    methods: {
      getReportList () {
        this.loading = true
        let params = {
          pageSize: this.pageSize,
          pageNumber: this.pageNumber

        }
        this.$api.getReportList(this.$route.query.id, params).then(res => {
          if (res.code === '000000') {
            this.loading = false
            console.log(res.data)
            this.tableData = res.data.list
            this.total = res.data.totalRow
            this.$message({
              type: 'success',
              message: '获取报件列表成功'
            })
          }
        })
      },
      goBack () {
        this.$router.go(-1)
      },
      handleChange (val) {
        this.pageNumber = val
        this.getReportList()
      }
    }
  }
</script>

<style lang="less">
  #reportList {
    color: white !important;
    height: 100%;
    width: 100%;
    overflow-x: auto;
    th {
      text-align: center;

    }

  }
</style>
